<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">


    <!-- <script type="text/javascript" src="js/header.js"></script> -->
    <script src="js/jquery-3.3.1.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/booking.css">
    <title>用户订单列表</title>
</head>
<body>

    <div id="header" class="headerpage"></div>
    <div style="text-align: center;" id="title">
        <p>火车购票系统 </p>
        <p>Welcome</p>
    </div>
    
        <form action="" id="indexForm" style="margin:0 510px;">
            <table class="table">         
            </table>

        </form>
  

 

    <script>
        let ids = new Array();

        $.ajax({
            url:"order",
            type:"post",
            success: function(data) {
                
                data = JSON.parse(data);
            
                if (data.code == 200) {
                    var lis = '<tr id="table_header" style="text-align: center;"><td colspan="6">车票详情列表</td></tr>';
                    var obj = data.data;
                    if (obj.length == 0) {
                        lis += '<tr style="text-align: center;"><td colspan="6">当前暂无订单 , 点击<a href = "booking.html">购买车票</a></td></tr>'
                        $("table").html(lis);
                    }
                    for (var i = 0 ; i < obj.length ; i++) {
                        ids[i] = obj[i].t_id;
                        lis += '<tr>';
                        lis += '<td rowspan="2" id="trip_id">'+obj[i].t_id+'</td>';
                        lis += '<td><img src="images/start.png" alt="" id="start"></td>';
                        lis += '<td>'+obj[i].start+'</td>';
                        lis += '<td>'+obj[i].start_time+'</td>';
                        lis += '<td rowspan="2">$'+obj[i].price+'</td>';
                       
                        lis += '<td rowspan="2"><input type="button" value="退票" onclick="concele('+i+')"></td>';
                        
                        lis += '</tr>';
                        lis += '<tr>';
                        lis += '<td><img src="images/end.png" alt=""></td>';
                        lis += '<td>'+obj[i].end+'</td>';
                        lis += '<td>'+obj[i].end_time+'</td>';
                        lis += '</tr>';

                    }
                    $("table").html(lis);
                } else if(data.code == 300) {
                    alert("请先登录");
                    location.href = "login.html";
                } else {
                    alert(data.msg);
                }
            }
        });


        function concele(i) {
            // alert(ids);
            // alert(i);
            // alert(ids[i]);
            $.ajax({
                url:'cancel',
                type:'post',
                data:{
                    id:ids[i]
                },
                success: function(data) {
                    data = JSON.parse(data);
                    alert(data.code);
                    if(data.code == 200) {
                        alert("退票成功");
                        location.href = 'orderList.html';
                    }else if(data.code == 300) {
                        alert("请先登录 , 点击确认跳转登录页面");
                        location.href = 'login.html';
                    }else {
                        alert("退票失败");
                    }
                }

            }) 
        }


    </script>
        <script>
            $(".headerpage").load("header.html")
        </script>

</body>
</html>



    
    
    
    
    



    


